src/features/study/one-to-one/archive/ui/archive-grid.tsx (1)

136-142: 링크 입력 필드에 유효성 검사 또는 길이 제한 추가를 고려하세요.

title과 description 입력에는 maxLength가 설정되어 있지만, 링크 입력에는 제한이 없습니다. URL 형식 검증이나 최대 길이 제한을 추가하면 사용자 경험과 데이터 무결성이 향상될 수 있습니다.

💡 maxLength 추가 예시

 <BaseInput
   id={`archive-link-${item.id}`}
   value={link}
   onChange={(e) => setLink(e.target.value)}
   placeholder="링크"
   className="w-full"
+  maxLength={2048}
 />

src/features/study/one-to-one/archive/ui/archive-list.tsx (2)

136-142: 링크 입력 필드에 유효성 검사 또는 길이 제한 추가를 고려하세요.

archive-grid.tsx와 동일하게, 이 컴포넌트의 링크 입력에도 maxLength 제한이 없습니다. 일관성을 위해 두 컴포넌트 모두 동일한 제한을 적용하는 것이 좋습니다.

💡 maxLength 추가 예시

 <BaseInput
   id={`archive-link-${item.id}`}
   value={link}
   onChange={(e) => setLink(e.target.value)}
   placeholder="링크"
   className="w-full"
+  maxLength={2048}
 />

---

37-87: LibraryCard와 LibraryRow 간의 편집 로직 중복을 추후 리팩토링 고려

archive-grid.tsx의 LibraryCard와 이 파일의 LibraryRow가 거의 동일한 상태 관리 및 핸들러 로직(title, description, link, nextPrivate 상태, useEffect 동기화, handleSave, handleCancel)을 공유하고 있습니다.

향후 유지보수성 향상을 위해 공통 로직을 커스텀 훅으로 추출하는 것을 고려해 보세요.

💡 커스텀 훅 추출 예시

// useArchiveEditing.ts
export function useArchiveEditing(item: ArchiveItem) {
  const [isEditing, setIsEditing] = React.useState(false);
  const [title, setTitle] = React.useState(item.title);
  const [description, setDescription] = React.useState(item.description ?? '');
  const [link, setLink] = React.useState(item.link ?? '');
  const [nextPrivate, setNextPrivate] = React.useState(!!item.isPrivate);

  React.useEffect(() => {
    if (!isEditing) {
      setTitle(item.title);
      setDescription(item.description ?? '');
      setLink(item.link ?? '');
      setNextPrivate(!!item.isPrivate);
    }
  }, [isEditing, item.title, item.description, item.link, item.isPrivate]);

  const buildUpdateRequest = (): UpdateArchiveRequest | null => {
    const request: UpdateArchiveRequest = {};
    // ... 변경 감지 로직
    return Object.keys(request).length > 0 ? request : null;
  };

  const resetFields = () => {
    setTitle(item.title);
    setDescription(item.description ?? '');
    setLink(item.link ?? '');
    setNextPrivate(!!item.isPrivate);
  };

  return {
    isEditing, setIsEditing,
    title, setTitle,
    description, setDescription,
    link, setLink,
    nextPrivate, setNextPrivate,
    buildUpdateRequest,
    resetFields,
  };
}

src/features/study/one-to-one/hall-of-fame/ui/mvp-team-card.tsx (1)

17-33: 주차 계산 로직 검토가 필요합니다.

현재 로직은 해당 월의 첫 번째 날의 요일을 기준으로 주차를 계산합니다. 이 방식이 비즈니스 요구사항(예: ISO 주차, 일요일/월요일 시작 등)과 일치하는지 확인이 필요합니다.

또한, IIFE 대신 useMemo를 사용하면 의존성이 명확해지고 불필요한 재계산을 방지할 수 있습니다.

♻️ useMemo 활용 제안

+'use client';
+
+import { Trophy, Flame } from 'lucide-react';
+import React, { useMemo } from 'react';
...

export default function MVPTeamCard({ team, className }: MVPTeamCardProps) {
-  const weekLabel = (() => {
+  const weekLabel = useMemo(() => {
    const dateSource = team.weekDate || team.weekStartDate;
    if (!dateSource) return 'MVP 팀';

    const date = new Date(dateSource);
    if (Number.isNaN(date.getTime())) return 'MVP 팀';

    const firstDayOfMonth = new Date(
      date.getFullYear(),
      date.getMonth(),
      1,
    ).getDay();
    const weekOfMonth =
      Math.floor((date.getDate() + firstDayOfMonth - 1) / 7) + 1;

    return `${date.getMonth() + 1}월 ${weekOfMonth}주차 MVP 팀`;
-  })();
+  }, [team.weekDate, team.weekStartDate]);

src/features/study/one-to-one/hall-of-fame/ui/rank-badge.tsx (1)

13-14: 중첩 삼항 연산자 가독성 개선을 고려해 주세요.

현재 로직은 동작하지만, 객체 매핑을 사용하면 확장성과 가독성이 향상됩니다.

♻️ 객체 매핑 방식 제안

+const RANK_ICONS: Record<number, React.ComponentType<React.SVGProps<SVGSVGElement>>> = {
+  1: GoldRankIcon,
+  2: SilverRankIcon,
+};

 export default function RankBadge({ rank }: RankBadgeProps) {
-  const Icon =
-    rank === 1 ? GoldRankIcon : rank === 2 ? SilverRankIcon : BronzeRankIcon;
+  const Icon = RANK_ICONS[rank] ?? BronzeRankIcon;